<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<%@ include file="/WEB-INF/views/include/head.jsp"%> 
<link rel="stylesheet" href="${ctxStatic}/css/common_erp.css">
<link rel="stylesheet" href="${ctxStatic}/css/list.css">
<script type="text/javascript">
     $(document).ready(function() {
		
		searchListForm();
		
            $(".tabBox ul li").each(function(){
                var index=$(this).index();

                $(".tabBox ul li").eq(0).addClass("active");

                $(this).click(function(){

                    $(this).addClass("active").siblings().removeClass("active");
                    
                    $("#tabPageStatus").val($(this).val());
                    searchListForm();
                    
                    $(".tabBoxSm > .tabSm").eq(index).stop(true).show().siblings().stop(true).hide();
					
					var tableW = $(".tabBoxSm > .tabSm").eq(index).find('.tableHead').width();
					var tabodyH = $(".tabBoxSm > .tabSm").eq(index).find('.tableBody').height();
					var tableScrollH = $(".tabBoxSm > .tabSm").eq(index).find('.tableScroll').height();
					if(tabodyH>tableScrollH){
						$(".tabBoxSm > .tabSm").eq(index).find('.tableScroll').css('width',tableW + 18 + 'px')
					}else{
						$(".tabBoxSm > .tabSm").eq(index).find('.tableScroll').css('width','inherit')
					}

                })

            })

        });
    
    // 检索方法
	function searchListForm() {
		var params = $("#searchForm").serialize();
		$("#activity_pane").showLoading();
		$.post("${ctx}/customenchase/single/searchList",params,function(result) {
					var listHtml = result["enchase"];
					var pageHtml = result["page"];
					$("#listHtml").html(listHtml);
					$("#paging").html(pageHtml);
					$("#activity_pane").hideLoading();
				}, 'json');
	}
	
	// 重置方法
	function clearParam() {
		$("#packageNo").val("");
		$("#customerContractNo").val("");
		$("#styleCustomerNo").val("");
		$("#styleNameCn").val("");
		$("#ognizationName").val("");
		searchListForm();
	}
	
    $(document).keydown(function(event){
    	if(event.keyCode == 13){
    		searchListForm();
    	}
    });
</script>
</head>
<body>
<form id="searchForm" method="post">
<div class="listArea" id="activity_pane">
	<div class="listBg">
        <div class="searchArea clearfix">
            <div class="searchLeft clearfix">
                <div class="searchInp clearfix">
                    <!-- 装箱单号 -->
                    <p><spring:message code="enchase_search_packageNo"/></p>
                    <input type="text" class="w-styleNub" id="packageNo" name="packageNo">
                </div>
            </div>
            <div class="searchRight clearfix">
                <!-- 检索 -->
                <button type="button" onclick="searchListForm();"><spring:message code="commom_check"/></button>
                <!-- 重置 -->
                <button type="button" onclick = "clearParam()"><spring:message code="common_reset"/></button>
                <!-- 创建 -->
                <button type="button" onclick="popup('1000px','700px','${ctx}/customenchase/single/form')"><spring:message code="common_create"/></button>
            </div>
        </div>
    </div>
    <input type="hidden" id="tabPageStatus" name="tabPageStatus" value="0"/>
    <div class="tabBox">
        <ul class="clearfix">
            <!-- 全部 -->
            <li class="active" value="0"><spring:message code="enchase_tab_all"/></li>
            <!-- 待提交 -->
            <li value="1"><spring:message code="enchase_tab_waitCommit"/></li>
            <!-- 待审核 -->
            <li value="2"><spring:message code="enchase_tab_waitAudit"/></li>
            <!-- 审核通过 -->
            <li value="3"><spring:message code="enchase_tab_auditAccess"/></li>
            <!-- 审核拒绝 -->
            <li value="4"><spring:message code="enchase_tab_auditRefuse"/></li>
            <!-- 待装箱 -->
            <li value="5"><spring:message code="enchase_tab_wait"/></li>
            <!-- 已装箱 -->
            <li value="6"><spring:message code="enchase_tab_done"/></li>
            <!-- 已删除 -->
            <li value="9"><spring:message code="enchase_tab_del"/></li>
        </ul>
	</div>
    <div class="listBg tabPadding overflowX">
        <div class="tableArea tabBoxSm">
            <div class="tableScrollSm" style="height:660px;overflow: auto;width: 997px;">
                <table cellpadding="0" class="tableHead" >
                    <thead>
                    <tr>
                        <!-- No -->
                        <th><p class="table-No"><spring:message code="enchase_details_head_no"/></p></th>
                        <!-- 装箱单号 -->
                        <th><p class="width-200px"><spring:message code="enchase_details_head_packageNo"/></p></th>
                        <!-- 交货日期-->
                        <th><p class="width-120px">交货日期</p></th>
                        <!-- 总箱数 -->
                        <th><p class="width-120px"><spring:message code="enchase_details_head_cartonQuantity"/></p></th>
                        <!-- 总数量 -->
                        <th><p class="width-120px"><spring:message code="enchase_details_head_styleQuantity"/></p></th>
                        <!-- 总毛重 -->
                        <th><p class="width-120px"><spring:message code="enchase_details_head_roughWeight"/></p></th>
                        <!-- 总净重 -->
                        <th><p class="width-120px"><spring:message code="enchase_details_head_NetWeight"/></p></th>
                        <!-- 总体积 -->
                        <th><p class="width-120px"><spring:message code="enchase_details_head_volume"/></p></th>
                    </tr>
                    </thead>
                </table>
                <table cellpadding="0" class="tableBody">
                    <tbody id="listHtml">
                    </tbody>
                </table>
            </div>
        </div>
    </div>
    <div id = "paging" ></div>
</div>
</form>   
</body>
</html>